<template>
  <div>
    <h1>{{ count }}</h1>
    <button @click="plus">增加</button>
  </div>
</template>

<script>
export default {
  name: "emitForCtxInSetup",
  props:{
    count:Number
  },
  // 注册emit
  emits:['plus'],
  setup(props, ctx) {
    // 不将props 放到 ctx 中的原因
    // 使用props比其他属性更加平常，大多数情况组件只是用props
    // props可以单独设置类型推断
    // 能够尽可能保证setup render函数 TSX 组件签名保持一致
    const plus = () =>{
      ctx.emit('plus',100);
    }
    // emit 就是vue　2.0　中的this.$emit() 传递自定义事件
    // setup中没有this
    // 原因:
    // 与vue2.0 的this 完全不同
    // 当使用setup 与其他2.0 选项一起使用时 会产生不必要的混乱
    // ctx.emit('name',content)
    return {
      plus
    }
  },
};
</script>

<style></style>
